/*
 * @LastEditors: zhouyaxue
 * @Date: 2022-08-18 15:34:54
 * @LastEditTime: 2023-01-07 18:10:27
 */
/**
* elementResize maps canvas使用
* @param {string} dom id名称
* @param {number} w 元素宽
* @param {number} h 元素高
*/
function elementResize (dom:string, w = 1920, h = 1080):void {
  const windowWidth = <number>(1920);
  const windowHeight = <number>(1080);
  const zoomX = <number>(1 / (document.documentElement.clientWidth / windowWidth));
  // const zoomY = <number>(1 / (document.documentElement.clientHeight / windowHeight));
  const width = <number>(document.documentElement.clientWidth - (windowWidth - w) * document.documentElement.clientWidth / windowWidth);
  const height = <number>(document.documentElement.clientHeight - (windowHeight - h) * document.documentElement.clientHeight / windowHeight);

  // window.addEventListener('resize', () => {
  //   width = document.documentElement.clientWidth - (windowWidth - w) * document.documentElement.clientWidth / windowWidth;
  //   height = document.documentElement.clientHeight - (windowHeight - h) * document.documentElement.clientHeight / windowHeight;
  //   // zoomX = 1 / (document.documentElement.clientWidth / windowWidth);
  //   // zoomY = 1 / (document.documentElement.clientHeight / windowHeight);
  //   useScaleType();
  // });

  function useScaleType ():void {
    const documents = <HTMLElement>document.getElementById(dom);
    if (document.getElementById(dom)) {
      documents.style.width = `${width}px`;
      documents.style.height = `${height}px`;
      documents.style.transform = `scale(${zoomX})`;
      documents.style.transformOrigin = 'left top';
    }
  }
  useScaleType();
}
function bodyResize ():void {
  const documentBody = <HTMLElement>document.getElementById('app');
  let zoomX = document.documentElement.clientWidth / 1920;
  // const zoomY = document.documentElement.clientHeight / 1080;

  window.onresize = () => {
    zoomX = document.documentElement.clientWidth / 1920;
    // zoomY = document.documentElement.clientHeight / 1080;
    useScaleType();
  };

  function useScaleType () {
    documentBody.style.transform = `scale(${zoomX})`;
    documentBody.style.transformOrigin = 'left top';
  }
  useScaleType();
}
export {
  bodyResize,
  elementResize
};
